<template>
  <el-upload
    v-model:file-list="fileList"
    :limit="10"
    action="http://gmall-h5-api.atguigu.cn/admin/product/fileUpload"
    :http-request="handleUpload"
  >
    <el-button type="primary">点击上传</el-button>
    <template #tip>
      <div class="el-upload__tip">上传文件大小不能超过1GB</div>
    </template>
  </el-upload>
</template>

<script lang="ts" setup>
defineOptions({
  name: "App",
});

import { ref } from "vue";

const fileList = ref([
  {
    name: "1.jpeg",
    percentage: 100, // 上传进度
    status: "uploading", // uploading 上传中，会显示进度条  success 上传成功
    uid: 1697598504326,
  },
]);

// const handleUpload = (options) => {
//   console.log(options);

//   // const file = fileList.value[fileList.value.length - 1];
//   const file = fileList.value.find((file) => file.name === options.file.name);
//   file.status = "uploading";
//   file.percentage = 10;
// };
</script>

<style scoped lang="scss"></style>
